微信H5开发实践

如果用户在微信客户端中访问第三方网页，公众号可以通过微信网页授权机制，来获取用户基本信息，进而实现业务逻辑。

2020.8.10 星期一 20：34

通过config接口注入权限验证配置

// 后端接口那会微信jssdk 配置信息，然后初始化
 axios.post(this.wxShareUrl).then((res) => {
     if (res.data.sign == 1) {
         let _config = res.data.msg.wxConf;
         let _debug = this.wxDebug && process.env.NODE_ENV == 'development';
         wx.config({
             debug: _debug,
             appId: _config.appId,
             timestamp: _config.timeStamp,
             nonceStr: _config.nonceStr,
             signature: _config.signature,
             jsApiList: this.jsApiList // 必填，需要使用的JS接口列表
         });
         // 判断当前客户端版本是否支持指定JS接口
         let _this = this;
         wx.checkJsApi({
             jsApiList: ['updateAppMessageShareData', 'updateTimelineShareData'],
             success: function (res) {
                 // 以键值对的形式返回，可用的api值true，不可用为false
                 let result = JSON.parse(res.checkResult);
                 if (result.updateAppMessageShareData && result.updateTimelineShareData) {
                     _this.wxUpdateStatus = true;
                 }
             }
         });
     }
 });

微信分享设置失败。多个地方引入wx（index.html，xesShare），致使wx undefined
测试环境设置微信分享，需要先关注公众号。是微信api做了安全方面的限制，好比小程序的体验者

微信分享设置（jssdk） ios 失败。
新增两个分享的接口，之前的4个即将废弃。
updateAppMessageShareData，updateTimelineShareData 这两接口设置是异步的。
所以最好提前设置。
分享接口

wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
wx.updateAppMessageShareData({ 
    title: '', // 分享标题
    desc: '', // 分享描述
    link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
    imgUrl: '', // 分享图标
    success: function () {
        // 设置成功
    }
})
});

分享链接。虽然没有看到（文档）中对链接长度的限制，但是url有长度限制（有吗？）；
通用的分享/裂变能力，链接都比较短。（初期）微博字数限制，短信限制
本次分享链接是用的短链接。（听说是链接长的话，生成的二维码模糊。能多长了）
分享小程序。h5 没有这个功能。app中可以通过自家的xesApp jssdk 设置分享类型为小程序
微信分享小程序的接口只给原生app提供了。h5没有该接口
打开小程序。同样也是原生有这个接口
h5页面可以通过 wx.config() openTagList 开放标签实现。也就是在微信公众号中可以打开的小程序
但是h5页面，直接打开小程序不行。
如果是内嵌在小程序里面web-view 则可以通过jssdk 打开小程序。wx.miniProgram.navigateTo
（是否需要一些其它配置待实践，比如公众号appid，注入config等）
挽留弹窗。首次进入的页面无法实现。在app中可以通过自己xesApp jssdk实现
web的beforeunload,unload 在微信环境被阉割了。
pageShow 可以监听到。pageHide 怎么监听，页面都关闭了。
市场上的方案，说通过history.pushState。但是首页的popState 的是监听不到的，
```
1）如果首页跳到第二个页面，第二个页面再回到首页。这时可以监听到popState，而且是两次。
2）如果是单页应用，进入其它路由 跳出后也会监听到popState （该路由页是不需要的；实践的hash路由是如此）
```
请注意，浏览器不会在调用pushState（）之后尝试加载此URL，但可能会稍后尝试加载URL，例如在用户重新启动浏览器之后。
History.pushState
$_PS: 也就是上面第一个问题。不只是在微信中
关闭当前页面。微信提供了关闭当前页面/浏览器的api。weixinjsbridge.invoke()
weixinjsbridge.invoke(‘closeWindow’, {}, function(){})
WeixinJSBridge.invoke(‘shareTimeline’,data,callback)
wx.closeWindow(); wx.hideShareMenu()
WeixinJSBridge 和 wx（jssdk）
WeixinJSBridge 是老的微信提供的能力，后出了jssdk。以前的一些功能/使用方式可能有区分，变化
jssdk 应该能力更强一些，包括其它方面